<template>
	<view class="content bg-img bg-mask " v-if="show22">
		<u-navbar :title="i18n.tongduii.i1" background="rgba(0,0,0,0)" back-icon-color="#fff" title-color="#fff"></u-navbar>

		<view class="flex  align-center justify-center">
			<view class="flex head  f30 align-center justify-center" style="height: 80rpx;">
				<text class="f-1 flex justify-center" @click="flg(1)" :class="[{ action: show }, { color: show }]">{{ i18n.tongduii.i7 }}</text>
				<text class="f-1 flex justify-center" @click="flg(2)" :class="[{ action: show1 }, { color: show1 }]">{{ i18n.tongduii.i6 }}</text>
			</view>
		</view>

		<view class="scroll" v-if="show">
			<view class="flex head  f30 ">
				<text class="f-1 flex justify-center f30">{{ i18n.tongduii.i8 }}</text>

				<text class="f-1 flex justify-center f30">{{ i18n.tongduii.i5 }}</text>
			</view>
			<view class="scroll" style="margin-top: 20rpx;">
				<view v-for="(item, index) in dataa.log" :key="index" class="padding-tb-sm  list f30 r flex  ">
					<text class="f-1 flex justify-center f22">{{ addrr(item.address) }}</text>
					<text class="f-1 flex justify-center f22 ">{{ item.num }}</text>
				</view>
			</view>
		</view>
		<view class="scroll" v-if="show1">
			<view class="flex head  f30 ">
				<text class="f-1 flex justify-center f30">{{ i18n.tongduii.i2 }}</text>
				<text class="f-1 flex justify-center f30">{{ i18n.tongduii.i3 }}</text>
				<text class="f-1 flex justify-center f30">{{ i18n.tongduii.i4 }}</text>
				<!-- <text class="f-1 flex justify-center f30">{{ i18n.tongduii.i8 }}</text> -->
			</view>
			<view class="scroll" style="margin-top: 20rpx;">
				<view v-for="(item, index) in data.log" :key="index" class="padding-tb-sm  list f30 r flex  ">
					<text class="f-1 flex justify-center f22">{{ addrr(item.from_address) }}</text>
					<text class="f-1 flex justify-center f22">{{ item.createtime | date('yyyy-mm-dd hh:MM:ss') }}</text>
					<text class="f-1 flex justify-center f22">{{ item.pe }}</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			CustomBar: this.CustomBar,
			data: {},
			dataa: {},
			addr: '',
			show22: true,
			show: true,
			show1: false,
			show2: false,
			list: [
				{
					name: '为本地址充币',
					disabled: false,
				},
				{
					name: '为其他地址充币',
					disabled: false,
				},
			],
		};
	},
	computed: {
		i18n() {
			return this.$t('message');
		},
	},
	onLoad(e) {
		// if (window.tronWeb) {
		// 	//this.dd()
		// 	this.getRecords();

		// } else {
		// 	this.show22 = false
		// 	uni.$showMsg('   非TOKEN钱包DAPP无法上链    ', 3000);
		// }

		var obj = setInterval(() => {
			if (window.tronWeb) {
				clearInterval(obj);
				this.getRecords();
				this.sys();
				this.show22 = true;
			} else {
				this.show22 = false;
			}
		}, 20);

		e && (this.addr = e.addr);
	},
	methods: {
		flg(e) {
			
			if (e == 1) {
				this.show = true;
				this.show1 = false;
				this.show2 = false;
			}
			if (e == 2) {
				this.show = false;
				this.show1 = true;
				this.show2 = false;
			}
			if (e == 3) {
				this.show = false;
				this.show1 = false;
				this.show2 = true;
			}
		},

		async sys() {
			let obj = {
				age: 1,
				rows: 100,
			};
			const res = await this.$u.post('/index.php/api/pe/invite', obj, { token: uni.getStorageSync('token') });

			this.dataa = res.data;
			console.log(' this.dataa >>  ', this.dataa);
		},
		ret() {
			console.log('1111 :>> ', 1111);
			uni.navigateBack({
				delta: 1,
			});
		},
		addrr(e) {
			console.log('e :>> ', e);
			if (e) {
				return e.substring(0, 4) + '****' + e.substring(e.length - 4);
			}
		},

		async getRecords() {
			let obj = {
				//uid: uni.getStorageSync("uid"),
				page: 1,
				rows: 100,
			};
			const res = await this.$u.post('/index.php/api/pe/usdtLog', obj, { token: uni.getStorageSync('token') });

			this.data = res.data;
			console.log('	this.data :>> ', this.data);
		},
	},
};
</script>

<style lang="scss" scoped>
.content {
	width: 100vw;
	height: 100vh;
	//overflow: hidden;
	background-image: url(../../static/gern.png);
	// .scroll {
	// 	height: calc(100vh - 80rpx);
	// 	overflow: scroll;
	// }

	.action::after {
		content: '';
		position: absolute;
		border-radius: 10%;

		bottom: 0;
		width: 80rpx;
		height: 4rpx;
		background: #04bd9e;
	}
	.scroll {
		height: calc(100vh - 80rpx);
		overflow: scroll;
		.head {
			position: relative;

			color: #f0f0f0;
			width: 702rpx;
			height: 78rpx;
			margin: 0 auto;
			display: flex;
			align-items: center;

			.color {
				color: #04bd9e;
			}
			.action::after {
				content: '';
				position: absolute;
				border-radius: 10%;

				bottom: 0;
				width: 80rpx;
				height: 4rpx;
				background: #04bd9e;
			}
		}
		.rchg {
			.rchgRec {
				display: flex;
				align-items: center;
				justify-content: center;

				//width: 140rpx;
				height: 46rpx;
				border: 1rpx solid #999999;
				border-radius: 23rpx;
				font-size: 26rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #e6e6e6;
				margin-top: 45rpx;
				padding: 0 10rpx;
			}

			.qianbao {
				height: 120rpx;
				margin-top: 40rpx;
				.left {
					display: flex;
					flex-direction: column;
					justify-content: center;

					.t1 {
						font-size: 38rpx;
						font-family: PingFang SC;
						font-weight: 500;
						color: #b3b3b3;
					}
					.t2 {
						margin-top: 20rpx;
						font-size: 20rpx;
						font-family: PingFang SC;
						font-weight: 500;
						color: #f0f0f0;
					}
				}
				.left {
				}
			}
			.computingPower {
				display: flex;
				align-items: center;
				flex-direction: column;
				justify-content: center;
				margin: 0 auto;
				margin-top: 55rpx;
				width: 702rpx;
				height: 145rpx;
				background: #0e1010;
				opacity: 0.7;
				border-radius: 20rpx;
				text {
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #04bd9e;
				}
			}
			.curr {
				margin-top: 25rpx;
				display: flex;
				flex-direction: column;
				justify-content: space-around;
				height: 148rpx;
				border-bottom: 2rpx solid #3c3c3c;
				text {
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #ffffff;
				}
				.inpt {
					display: flex;
					justify-content: space-between;
					align-items: center;
				}
			}
			.singleChoice {
				height: 70rpx;
				display: flex;
				align-items: center;
			}
			.btn {
				display: flex;
				align-items: center;
				justify-content: center;
				margin: 0 auto;
				margin-top: 100rpx;
				width: 452rpx;
				height: 69rpx;
				background: #04bd9e;
				border-radius: 35rpx;
				font-size: 30rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #ffffff;
			}
		}
	}
	.head {
		margin-top: 90rpx;
		color: #f0f0f0;
		width: 702rpx;
		margin: 0 auto;
		//margin-bottom: 50rpx;
	}
	.list {
		width: 702rpx;
		height: 70rpx;
		color: #b3b3b3;
		background-color: #000000;
		margin: 0 auto;
		margin-bottom: 20rpx;
	}
}
</style>
